<template>
	<view style="padding: 40rpx;">
		<u-row justify="center" customStyle="margin-top: 200rpx;">
			<u--image shape="circle" src="/static/logo/logo_500_500.png" width="80px" height="80px"></u--image>
		</u-row>
		<u-row justify="center" customStyle="margin-top: 100rpx">
			<u-button v-if="readXieYi" open-type="getPhoneNumber" @getphonenumber="getPhoneNumber" text="手机号码一键登录"
				customStyle="border-radius:10px;background-color:  #73de87;"></u-button>
			<u-button @click="readXieYiBut" v-if="!readXieYi" text="手机号码一键登录"
				customStyle="border-radius:10px;background-color:  #73de87;"></u-button>				
		</u-row>
		<u-row justify="center" customStyle="margin-top: 30rpx">
			<u-button @click="toPhoneLogin" type="default" text="其他手机号登录"
				customStyle="border-radius:10px;background-color:  #f1f1f1;"></u-button>
		</u-row>
		<view style="margin-top: 150rpx;display: flex;justify-content: center;">
			<view>
				<u-checkbox-group @change="checkboxChange" placement="row">
					<u-checkbox name="readXieYi" label="我已阅读并同意"></u-checkbox>
				</u-checkbox-group>
			</view>
			<view>
				<u--text color="#73de87" size="16" text="用户协议,"
					@click="gotoWeb('https://developers.weixin.qq.com/miniprogram/dev/framework/')"></u--text>
			</view>
			<view>
				<u--text color="#73de87" size="16" text="隐私政策"
					@click="gotoWeb('https://developers.weixin.qq.com/miniprogram/dev/framework/')"></u--text>
			</view>
		</view>
		<u-toast ref="uToast"></u-toast>
	</view>
</template>

<script>
	import {
		mapState,
		mapActions
	} from 'vuex';

	let that;

	export default {
		data() {
			return {
				phoneNum: '',
				captcha: '',
				readXieYi: false,
				code: '',
				successUrl: '/pages/index/index',
			}
		},

		methods: {
			...mapActions(['userLoginAction', 'userLogoutAction']),
			onLoad: function(option) {
				console.log(option.successUrl); 
				this.successUrl = option.successUrl;
			},
			toPhoneLogin() {
				if(!this.readXieYi){
					uni.$u.toast('请先阅读并勾选《用户协议》');
					return;
				}
				uni.navigateTo({
					url: `/pages/login/phone_login?successUrl=`+this.successUrl
				})
			},
			checkboxChange(n) {
				console.log('radioChange', n);
				if (n.length > 0) {
					this.readXieYi = true;
				} else {
					this.readXieYi = false;
				}
			},
			readXieYiBut(){
				if(!this.readXieYi){
					uni.$u.toast('请先阅读并勾选《用户协议》');
					return;
				}
			},
			getPhoneNumber(e) {
				if(!this.readXieYi){
					uni.$u.toast('请先阅读并勾选《用户协议》');
					return;
				}
				
				that = this;
				// 执行手机号登录的逻辑
				// #ifdef MP-WEIXIN
				const {
					errMsg,
					encryptedData,
					iv,
					code
				} = e.detail;
				if (e.detail.errMsg == 'getPhoneNumber:fail user deny') {
					console.log('用户拒绝授权=>');
				} else {
					console.log('用户同意授权=>', errMsg);
					wx.login({
						success: res => {
							that.code = res.code;
							console.log("code:" + that.code + ",phoneCode:" + code + ",data:" + encryptedData,res)
							//登录凭证校验,返回用户唯一标识、会话密钥
							that.$http_api.loginByWx({
								loginCode: that.code,
								phoneCode: code,
								encryptedData: encryptedData,
								iv: iv,
							}).then((res) => {
								if (res) {
									console.log("******************",that.successUrl)
									that.userLoginAction(res);
									that.$refs.uToast.show({
										type: 'default',
										position: 'center',
										message: "登录成功",
										complete() {
											if(that.successUrl){
												const pages =  getCurrentPages();
												console.log("pages:",pages)
												const backIndex = 0;
												for(var i=0;i<pages.length;i++){
													const page = pages[i];
													console.log("page:",page);
													if(page.route == that.successUrl){
														backIndex = i;
													}
												}
												uni.navigateBack({
													delta: backIndex,
													 success: function () {
													        const pages = getCurrentPages(); //获取当前页面栈
													        const prevPage = pages[pages.length - 1]; //获取上一个页面实例对象
													        prevPage.onLoad(); //调用上一个页面的onLoad方法
															console.log(prevPage.route+"刷新")
													    }
												});
											}
											
											// that.successUrl && uni.redirectTo({
											// 	url: that.successUrl
											// })
										}
									})
								}
							})
						}
					});


				}
				// #endif
			},
			gotoWeb: function(url) {
				uni.navigateTo({
					url: `/pages/webview/webview?url=${url}`
				})
			}
		}
	}
</script>

<style scoped>

</style>